﻿
@{
    Layout = null;
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>layui-ckplayer 示例</title>
    <link rel="stylesheet" href="~/Content/layui-ckplayer-master/example/layui/css/layui.css">
</head>
<body>
    <ul class="layui-nav layui-bg-green" lay-filter="">
        <li class="layui-nav-item"><a href="">layui-ckplayer 示例</a></li>
    </ul>

    <div class="layui-container">
        <div class="layui-row">
            <div class="layui-col-md12">
                <section class="layui-card">
                    <div class="layui-card-body">
                        <div class="video" id="video" style="width: 833px;height: 500px"></div>
                    </div>
                </section>
            </div>
            <div>
                <div style="margin: 50px 0 20px;">
                    <a style="text-decoration: none;    color: #333;"></a>
                    <fieldset style="border: none;padding: 0;border-top: 1px solid #eee;">
                        <legend style="margin-left: 20px;padding: 0 10px; font-size: 22px; font-weight: 300;}">说明</legend>
                    </fieldset>
                </div>
                <div class="site-text">
                    <p>基于ckplayer视频播放器封装的，适用于layui的扩展组件</p>
                </div>
            </div>
        </div>
    </div>
    <script src="~/Content/layui-ckplayer-master/example/layui/layui.js" charset="utf-8"></script>
    <script>
        var videoUrl;

        $ = layui.$;
        $.ajax({
			url: "@Url.Action("text")",
			type: "get",
            success: function (da) {
                videoUrl = "/" + da.data;
                videoUrl = videoUrl.toString();
                console.log(videoUrl)

                //config的设置是全局的
                layui.config({
                    //存放拓展模块的根目录
                    base: '/Content/layui-ckplayer-master/lib/'
                }).extend({
                    //设定模块别名
                    ckplayer: 'ckplayer/ckplayer'
                }).use(['ckplayer'], function () {
                    var ckplayer = layui.ckplayer;
                    //定义视频资源地址
                    //var videoUrl = "/Content/layui-ckplayer-master/example/video_resource.mp4";
                    //由于X2的ckplayer需要用url请求方式获取配置json
                    //因此定义请求的根目录

                    var baseUrl = "/Content/layui-ckplayer-master/lib/ckplayer/"
                    //定义一个变量：videoObject，用来做为视频初始化配置
                    var videoObject = {
                        container: '#video',
                        variable: 'player',
                        video: videoUrl, //视频地址
                        baseUrl: baseUrl //配置json所在目录
                    };
                    var player = new ckplayer(videoObject);//初始化播放器

                });


			},
		})


    </script>
</body>
</html>